// pages/index5/index5.js
Page({
  data: {
    box: '',
    ctxs: '',
    pageH: "",
    lv: '',

    rdata: '',
    ldata: '',

    //最终坐标
    startx: '',
    starty: '',
    endx: '',
    endy: '',

    // move 状态
    mid_endx: '',
    mid_endy: '',
    mid_startx: '',
    mid_starty: '',

    startitemtype: '',
    startitemindex: '',

    // ### canvas 属性
    linewidth: 8,
    linestyle: "#f9225d",//连线绘制--线宽，线色

    link:[],

    jinduwidth:0,


    zhengquedana:[{l:0,r:4},{l:1,r:0},{l:2,r:3},{l:3,r:2},{l:4,r:1}],

    alltrue:false,
    shownoalltc:false,
    showggtc:false,

    videoAd:""
  },
  onLoad: function (options) {
    
  },

  onShow:function(){
    tt.showLoading({
      title: "加载中，请稍后...",
    });
    console.log(tt.getSystemInfoSync().windowWidth)
    var windowWidth = tt.getSystemInfoSync().windowWidth
    var windowHeight = tt.getSystemInfoSync().windowHeight
    var lv = windowWidth / 750;
    var pageH = 1450 * lv

    // if (windowHeight > pageH) {
    //   pageH = windowHeight
    // }

    var ctxs = tt.createCanvasContext('Canvass');

    var ctx = tt.createCanvasContext('ctx');

    var bctx = tt.createCanvasContext('bctx');

    this.setData({
      ctx: ctx,
      ctxs: ctxs,
      bctx:bctx,
      lv: lv,
      pageH: pageH
    })

    const aa = tt.createSelectorQuery()
    aa.select('#test').boundingClientRect()

    var that = this
    aa.exec(function (res) {
      var box = res[0]
      console.log(box)

      that.setData({
        box: box,
      })

      that.data.ctxs.drawImage('/pages/images/bg.png', 0, 0, that.data.box.width, that.data.box.height);

      that.data.ctxs.drawImage('/pages/images/image5/head.png', 0, 0, 750 * that.data.lv, 312 * that.data.lv);

      that.data.ctxs.drawImage('/pages/images/image5/l1.png', 62 * that.data.lv, 380 * that.data.lv, 214 * that.data.lv, 118 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/l2.png', 62 * that.data.lv, 532 * that.data.lv, 214 * that.data.lv, 118 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/l3.png', 62 * that.data.lv, 688 * that.data.lv, 214 * that.data.lv, 118 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/l4.png', 62 * that.data.lv, 846 * that.data.lv, 214 * that.data.lv, 118 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/l5.png', 62 * that.data.lv, 998 * that.data.lv, 214 * that.data.lv, 118 * that.data.lv);


      that.data.ctxs.drawImage('/pages/images/image5/r1.png', 373 * that.data.lv, 361 * that.data.lv, 322 * that.data.lv, 144 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/r2.png', 373 * that.data.lv, 517 * that.data.lv, 322 * that.data.lv, 144 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/r3.png', 373 * that.data.lv, 673 * that.data.lv, 322 * that.data.lv, 144 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/r4.png', 373 * that.data.lv, 829 * that.data.lv, 322 * that.data.lv, 144 * that.data.lv);
      that.data.ctxs.drawImage('/pages/images/image5/r5.png', 373 * that.data.lv, 985 * that.data.lv, 322 * that.data.lv, 144 * that.data.lv);


      setTimeout(function(){
        tt.hideLoading();
        that.data.ctxs.draw()
      },1000)  

      var ldata = [
        { minx: 62 * that.data.lv + 214 * that.data.lv / 2, miny: 380 * that.data.lv + 118 * that.data.lv / 2, fanwei: { zsx: 62 * that.data.lv, zsy: 380 * that.data.lv, zxx: 62 * that.data.lv + 214 * that.data.lv, zxy: 380 * that.data.lv + 118 * that.data.lv } },
        { minx: 62 * that.data.lv + 214 * that.data.lv / 2, miny: 532 * that.data.lv + 118 * that.data.lv / 2, fanwei: { zsx: 62 * that.data.lv, zsy: 532 * that.data.lv, zxx: 62 * that.data.lv + 214 * that.data.lv, zxy: 532 * that.data.lv + 118 * that.data.lv } },
        { minx: 62 * that.data.lv + 214 * that.data.lv / 2, miny: 688 * that.data.lv + 118 * that.data.lv / 2, fanwei: { zsx: 62 * that.data.lv, zsy: 688 * that.data.lv, zxx: 62 * that.data.lv + 214 * that.data.lv, zxy: 688 * that.data.lv + 118 * that.data.lv } },
        { minx: 62 * that.data.lv + 214 * that.data.lv / 2, miny: 846 * that.data.lv + 118 * that.data.lv / 2, fanwei: { zsx: 62 * that.data.lv, zsy: 846 * that.data.lv, zxx: 62 * that.data.lv + 214 * that.data.lv, zxy: 846 * that.data.lv + 118 * that.data.lv } },
        { minx: 62 * that.data.lv + 214 * that.data.lv / 2, miny: 998 * that.data.lv + 118 * that.data.lv / 2, fanwei: { zsx: 62 * that.data.lv, zsy: 998 * that.data.lv, zxx: 62 * that.data.lv + 214 * that.data.lv, zxy: 998 * that.data.lv + 118 * that.data.lv } }
      ]

      var rdata = [
        { minx: 373 * that.data.lv + 322 * that.data.lv / 2, miny: 361 * that.data.lv + 144 * that.data.lv / 2, fanwei: { zsx: 373 * that.data.lv, zsy: 361 * that.data.lv, zxx: 373 * that.data.lv + 322 * that.data.lv, zxy: 361 * that.data.lv + 144 * that.data.lv } },
        { minx: 373 * that.data.lv + 322 * that.data.lv / 2, miny: 517 * that.data.lv + 144 * that.data.lv / 2, fanwei: { zsx: 373 * that.data.lv, zsy: 517 * that.data.lv, zxx: 373 * that.data.lv + 322 * that.data.lv, zxy: 517 * that.data.lv + 144 * that.data.lv } },
        { minx: 373 * that.data.lv + 322 * that.data.lv / 2, miny: 673 * that.data.lv + 144 * that.data.lv / 2, fanwei: { zsx: 373 * that.data.lv, zsy: 673 * that.data.lv, zxx: 373 * that.data.lv + 322 * that.data.lv, zxy: 673 * that.data.lv + 144 * that.data.lv } },
        { minx: 373 * that.data.lv + 322 * that.data.lv / 2, miny: 829 * that.data.lv + 144 * that.data.lv / 2, fanwei: { zsx: 373 * that.data.lv, zsy: 829 * that.data.lv, zxx: 373 * that.data.lv + 322 * that.data.lv, zxy: 829 * that.data.lv + 144 * that.data.lv } },
        { minx: 373 * that.data.lv + 322 * that.data.lv / 2, miny: 985 * that.data.lv + 144 * that.data.lv / 2, fanwei: { zsx: 373 * that.data.lv, zsy: 985 * that.data.lv, zxx: 373 * that.data.lv + 322 * that.data.lv, zxy: 985 * that.data.lv + 144 * that.data.lv } }
      ]

      that.setData({
        rdata: rdata,
        ldata: ldata
      })

    })


    this.videoAdCreat()


    this.setData({
      link:[]
    })
    console.log('11')
    this.bstrockline()

  },
  lookguanggao:function(){
    if(this.data.link.length<5){
      this.setData({
        shownoalltc:true
      })
    }else{
       this.videoAdLoad()
    }
  },
  quxiaotc:function(){
     this.setData({
      showggtc:false
    })
  },
  tuichushownoalltc:function(){
    this.setData({
      shownoalltc:false
    })
  },


  //动起来

  dongqilai:function(){
    var that=this
    var timer=setInterval(function(){
      var jinduwidth= that.data.jinduwidth
      if(jinduwidth==100){
        that.setData({
          jinduwidth:0
        })
      }else{
        jinduwidth=jinduwidth+10
        that.setData({
          jinduwidth:jinduwidth
        })
      }
      that.setData({
        timer:timer
      })
    },200)
  },

  touchstartaa: function (event) {
    console.log(event)

    var mid_startx = event.touches[0].pageX - this.data.box.left;
    var mid_starty = event.touches[0].pageY - this.data.box.top;

    this.setData({
      mid_startx: mid_startx,
      mid_starty: mid_starty,
      startx: '',
      starty: '',
      startitemtype: '',
      startitemindex: '',
    })


    for (var i = 0; i < this.data.rdata.length; i++) {

      // console.log(this.data.rdata[i])

      if ((this.data.mid_startx >= this.data.rdata[i].fanwei.zsx && this.data.mid_startx <= this.data.rdata[i].fanwei.zxx) && (this.data.mid_starty >= this.data.rdata[i].fanwei.zsy && this.data.mid_starty <= this.data.rdata[i].fanwei.zxy)) {
        this.setData({
          startx: this.data.rdata[i].minx,
          starty: this.data.rdata[i].miny,

          startitemtype: 'R',
          startitemindex: i,
        })
      } else {
        // console.log('nonr')
      }
    }

    for (var i = 0; i < this.data.ldata.length; i++) {

      if ((this.data.mid_startx >= this.data.ldata[i].fanwei.zsx && this.data.mid_startx <= this.data.ldata[i].fanwei.zxx) && (this.data.mid_starty >= this.data.ldata[i].fanwei.zsy && this.data.mid_starty <= this.data.ldata[i].fanwei.zxy)) {
        this.setData({
          startx: this.data.ldata[i].minx,
          starty: this.data.ldata[i].miny,

          startitemtype: 'L',
          startitemindex: i,
        })

      } else {
        // console.log('nonr')
      }
    }

  },
  touchmove: function (event) {

    var mid_endx = event.touches[0].pageX - this.data.box.left;
    var mid_endy = event.touches[0].pageY - this.data.box.top;
    this.setData({
      mid_endx: mid_endx,
      mid_endy: mid_endy
    })

    if (this.data.startitemtype) {
      this.strockline()
    }
  },
  touchendaa: function (event) {
    console.log(event)

    var mid_endx = event.changedTouches[0].pageX 
    var mid_endy = event.changedTouches[0].pageY 

    // endx: '',
    // endy: '',
    this.setData({
      mid_endx:mid_endx,
      mid_endy:mid_endy
    })

    if (this.data.startitemtype == 'L') {

      for (var i = 0; i < this.data.rdata.length; i++) {

        // console.log(this.data.rdata[i])

        if ((this.data.mid_endx >= this.data.rdata[i].fanwei.zsx && this.data.mid_endx <= this.data.rdata[i].fanwei.zxx) && (this.data.mid_endy >= this.data.rdata[i].fanwei.zsy && this.data.mid_endy <= this.data.rdata[i].fanwei.zxy)) {
          this.setData({
            endx: this.data.rdata[i].minx,
            endy: this.data.rdata[i].miny
          })

          var obj = { startx: this.data.startx, starty: this.data.starty, endx: this.data.endx, endy: this.data.endy, lnum: this.data.startitemindex, rnum: i }
          var link = this.data.link

          for (var j = 0; j < link.length; j++) {
            if (link[j].lnum == this.data.startitemindex) {
              console.log('shanchu')
              link.splice(j, 1);//从start的位置开始向后删除delCount个元素 
            }
          }

          for (var k = 0; k < link.length; k++) {
            if (link[k].rnum == i) {
              console.log('shanchu')
              link.splice(k, 1);//从start的位置开始向后删除delCount个元素
            }
          }


          link.push(obj)
          this.setData({
            link: link
          })

          this.setData({
            startx: '',
            starty: '',
            endx: '',
            endy: '',

            mid_endx: '',
            mid_endy: '',
            mid_startx:"",
            mid_starty:"",

            startitemtype: '',
            startitemindex: '',

          })

          this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);

          this.bstrockline()

        } else {
          console.log('nonr')
        }
      }

      if (this.data.endx == '') {
        console.log('sssss')
         this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);
        this.data.ctx.draw();
      }


    } else if (this.data.startitemtype == 'R') {

      for (var i = 0; i < this.data.rdata.length; i++) {
        if ((this.data.mid_endx >= this.data.ldata[i].fanwei.zsx && this.data.mid_endx <= this.data.ldata[i].fanwei.zxx) && (this.data.mid_endy >= this.data.ldata[i].fanwei.zsy && this.data.mid_endy <= this.data.ldata[i].fanwei.zxy)) {
          this.setData({
            endx: this.data.ldata[i].minx,
            endy: this.data.ldata[i].miny
          })

          var obj = { startx: this.data.startx, starty: this.data.starty, endx: this.data.endx, endy: this.data.endy, lnum: i, rnum: this.data.startitemindex }
          var link = this.data.link

          for (var j = 0; j < link.length; j++) {
            if (link[j].rnum == this.data.startitemindex) {
              console.log('shanchu')
              link.splice(j, 1);//从start的位置开始向后删除delCount个元素
            }
          }
          for (var k = 0; k < link.length; k++) {
            if (link[k].lnum == i) {
              console.log('shanchu')
              link.splice(k, 1);//从start的位置开始向后删除delCount个元素
            }
          }


          link.push(obj)
          this.setData({
            link: link
          })

          this.setData({
            startx: '',
            starty: '',
            endx: '',
            endy: '',
            mid_endx: '',
            mid_endy: '',
            startitemtype: '',
            startitemindex: '',

          })

          this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);
          this.bstrockline()
        } else {
          console.log('nonr')
        }
      }

      if (this.data.endx == '') {
        // console.log('sssss')
         this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);
        this.data.ctx.draw();
      }
    }

    if(this.data.link.length==5){
      var numtrue=0
      
      for(var i=0;i<5;i++){
         console.log('11')
        for(var j=0;j<5;j++){
          if(this.data.zhengquedana[i].l == Number(this.data.link[j].lnum) && this.data.zhengquedana[i].r == Number(this.data.link[j].rnum) ){
            numtrue=numtrue+1
            console.log(numtrue)
          }
          console.log('11')
        }
      }

      console.log(numtrue)
      if(numtrue==5){
        this.setData({
          alltrue:true
        })
      }else{
        this.setData({
          alltrue:false
        })
      }
    }
  },


  strockline: function () {//绘制
    this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);
    this.data.ctx.save();
    this.data.ctx.beginPath();
    this.data.ctx.setLineWidth(this.data.linewidth)
    this.data.ctx.moveTo(this.data.startx, this.data.starty);
    this.data.ctx.lineTo(this.data.mid_endx, this.data.mid_endy);
    this.data.ctx.setStrokeStyle(this.data.linestyle)
    this.data.ctx.stroke();
    this.data.ctx.restore();
    this.data.ctx.draw();

  },

   bstrockline: function () {//绘制
    this.data.ctx.clearRect(0, 0, this.data.box.width, this.data.pageH);
    for(var i=0;i<this.data.link.length;i++){
      // this.data.bctx.clearRect(0, 0, 100, 100);
      this.data.bctx.save();
      this.data.bctx.beginPath();
      this.data.bctx.setLineWidth(this.data.linewidth)

      this.data.bctx.moveTo(this.data.link[i].startx, this.data.link[i].starty);
      this.data.bctx.lineTo(this.data.link[i].endx, this.data.link[i].endy);

      this.data.bctx.setStrokeStyle(this.data.linestyle)
      this.data.bctx.stroke();
      this.data.bctx.restore();
     
    }

     this.data.bctx.draw();

  },

  videoAdCreat() {
     var that=this
    // 在页面onLoad回调事件中创建激励视频广告实例
    if (tt.createRewardedVideoAd) {
      that.videoAd = tt.createRewardedVideoAd({
        adUnitId: '54aidd45828b1dgb22'
      })


      console.log(that.videoAd)
      that.videoAd.onError((err) => {
        tt.showToast({
          title: that.videoAdErrHandle(err),
          icon: 'none'
        })
      })
      // 监听关闭
     
      that.videoAd.onClose((status) => {
        if (status && status.isEnded || status === undefined) {
         
          // console.log('视频正常关闭 下发奖励')

           if (that.data.alltrue == false) {
              console.log('错的干啥')
              
              tt.redirectTo({
                url: "/pages/next/next?lose=" + 5,
              });
            } else {
              console.log('对的干啥')
              tt.redirectTo({
                url: "/pages/next/next?diwusucceed=" + 5,
              });
            }
         
        } else {
          // 播放中途退出，进行提示
          // tt.showToast({ title: '未完整观看视频不能获取奖励哦', icon: 'none' })

           if (that.data.alltrue == false) {
              console.log('错的干啥')
              
              tt.redirectTo({
                url: "/pages/next/next?lose=" + 5,
              });
            } else {
              console.log('对的干啥')
              tt.redirectTo({
                url: "/pages/next/next?diwusucceed=" + 5,
              });
            }
        }
      })
    }
  },
  videoAdLoad() {
    // 用户触发广告后，显示激励视频广告
    var that=this
    console.log(that.videoAd)
    if (that.videoAd) {
      that.videoAd.show().catch((err) => {
        that.videoAd.load()
          .then(() => that.videoAd.show())
          .catch(err => {
            tt.showToast({
              title: that.videoAdErrHandle(err),
              icon: 'none'
            })
          })
      })
    }
  },
  videoAdErrHandle(err) {
    console.log('视频加载失败')
    console.log(err)
    // {errMsg: "no advertisement", errCode: 1004}
    const errHandle = {
      1000: '后端接口调用失败',
      1001: '参数错误',
      1002: '广告单元无效',
      1003: '内部错误',
      1004: '无合适的广告',
      1005: '广告组件审核中',
      1006: '广告组件被驳回',
      1007: '广告组件被封禁',
      1008: '广告单元已关闭',
    }
    return errHandle[err.errCode] || '视频加载错误,重新加载页面试试吧'
  },

})